<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/pc_common.css">
    <link rel="stylesheet" href="../inf/font_n5t1ksdn35/iconfont.css">
    <link rel="stylesheet" href="../css/sign.css">

</head>

<body>
    <div class="header-box">
        <div class="header">
            <a href="../html/index.html"> <img src="https://timeclub.danielwellington.cn/assets/img/icons/logo.svg"
                    alt=""></a>


        </div>
        <div class="nav">
            <ul>
                <li><a href="../html/detail.html">会员活动</a></li>
                <li><a href="../html/detail.html">手表</a></li>
                <li><a href="../html/detail.html">配饰</a></li>
                <li><a href="../html/detail.html">礼品套装</a></li>
                <li><a href="../html/detail.html">表带</a></li>
            </ul>
        </div>

    </div>
    <div class="banner-box">
        <div class="banner">
            <p>独家礼遇 会员尊享</p>
            <p>悦享爱意，报以时光</p>
            <p>S H A R E &nbsp;&nbsp; L O V E R &nbsp;&nbsp;E T U R N &nbsp;&nbsp;I N&nbsp;&nbsp; T I M E</p>
        </div>
    </div>
    <form action="">
        <p>手机号码</p>
        <input type="text" placeholder="请输入您的手机号码" class="phone">
        <p class="tips"></p>
        <p>验证码</p>

        <div class="yz">
            <div class="mc"></div>
            <input type="text" class="yzm" placeholder="请输入短信验证码">
            <span><a href="javascript:" class="rest">获取验证码</a></span>
            <p class="tips"></p>
        </div>
        <div class="sign">登录</div>
        <div class="msg">
            <span>还不是会员？</span>
            <a href="../html/regi.html">立即注册</a>
        </div>
        <div class="line"></div>
        <div class="type">
            <p>使用第三方账号</p>
            <p>
                <a href=""> <span class="iconfont icon-weixin"></span></a>
                </span>
                <a href=""><span class="iconfont icon-weibo"></span></a>

            </p>
        </div>
    </form>
    <div class="botton-box">
        <div class="botton">
            <div class="helpMsg">
                <ul>
                    <li><a href=""><span>防伪声明</span><span>l</span></a></li>
                    <li><a href=""><span>使用条款</span><span>l</span></a></li>
                    <li><a href=""><span>隐私政策</span><span>l</span></a></li>
                    <li><a href=""><span>网站地图</span></a></li>
                </ul>
            </div>

            <div class="msg">
                <img src="../img/gh.png" alt="">
                <a href=""><span>粤公网安备 44030502000796号</span></a>
                <a href=""><span>粤ICP备15098750号</span></a>
                <a href=""><span class="borderR">营业执照</span></a>
            </div>
            <div class="company">
                <p>ALL RIGHTS RESERVED. COPYRIGHT © 丹尼尔惠灵顿贸易（深圳）有限公司</p>
            </div>
        </div>

    </div>
</body>
<script src="../js/jquery-3.6.0.min.js"></script>
<script src="../js/api.js"></script>
<script src="../js/cookie.js"></script>
<script>
    var phoneflag = false
    var yzmflag = false
    $("input").click(function () {
        $(this).css({ boxShadow: " 0 0 8px 0 rgba(0,0,0,.25)" })
    })
    $("input").blur(function () {

        $(this).css({ boxShadow: "none" })
    })
    $(document).on("blur", ".phone", function () {
        var phone = $(this).val();
        var x = new RegExp(/^1[3-9]\d{9}$/);
        console.log(phone);
        if (x.test(phone)) {
            $(".phone").addClass("tipsBlue");
            $(".phone").next().text("");
            phoneflag = true
        } else {
            $(".phone").addClass("tipsRed");
            $(".phone").next().text("请输入11位正确手机号码");
            phoneflag = false
        }
    })
    $(document).on("click", ".rest", function () {
        console.log(1);
        var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0, "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"]
        var str = ""
        for (var i = 0; i < 4; i++) {
            var x = Math.floor(Math.random() * (arr.length))
            str += arr[x]
        }
        $(this).text(str).siblings(".mc");
        $(".mc").remove();
        // console.log($(this).text(str).siblings(".mc"));
    })
    $(document).on("blur", ".yzm", function () {
        var yzm = $(".rest").text();
        var x = $(this).val();
        if (x == yzm) {
            // $(".yzm").addClass("tipsBlue");
            $(".yzm").removeClass("tipsRed").addClass("tipsBlue").next().next().text("");
            // $(".yzm");
            yzmflag = true;
        } else {
            $(".yzm").removeClass("tipsBlue").addClass("tipsRed").next().next().text("请输入准确的验证码");

            yzmflag = false;

        }
    })
    $(document).on("click", ".sign", function () {
        var phone = $(".phone").val();

        if (yzmflag && phoneflag) {

            login({ phone }).then(function (result) {
                var { status, detail, list, phone } = result;
                if (status) {
                    setCookie("lgc", list);
                    setCookie("phone", phone);
                    var search = location.search;
                    if (search) {
                        var returnUrl = search.split("=")[1];
                        location.href = decodeURIComponent(returnUrl);
                    } else {
                        location.href = "../html/index.html";
                    }

                } else {
                    alert(detail)
                    location.reload();
                }
            })
        }
    })
</script>

</html>